<!DOCTYPE html>
<html>
<head>
    <title>Whats Going On, Matsuyama City</title>
    <link rel="stylesheet" href="app.css" type="text/css">
    <style type="text/css">
        .text{text-align: center}
            /**
            * Example of an initial loading indicator.
            * It is recommended to keep this as minimal as possible to provide instant feedback
            * while other resources are still being loaded for the first time
            */
        html, body {
            height: 100%;
           background-color: #1985D0
        }

        #appLoadingIndicator {
              position: absolute;
              top: 50%;
              margin-top: -15px;
              text-align: center;
              width: 100%;
              height: 30px;
              -webkit-animation-name: appLoadingIndicator;
              -webkit-animation-duration: 0.5s;
              -webkit-animation-iteration-count: infinite;
              -webkit-animation-direction: linear;
          }

        #appLoadingIndicator > * {
            background-color: #FFFFFF;
            display: inline-block;
            height: 30px;
            -webkit-border-radius: 15px;
            margin: 0 5px;
            width: 30px;
            opacity: 0.8;
        }

        @-webkit-keyframes appLoadingIndicator{
            0% {
                opacity: 0.8
            }
            50% {
                opacity: 0
            }
            100% {
                opacity: 0.8
            }
        }
    </style>
    <script type="text/javascript" src="touch/sencha-touch-debug.js"></script>
    <script type="text/javascript" charset="utf-8">
      Ext.Loader.setConfig({
          enabled: true,
          paths: { 'Ext': 'touch/src' }
      });
    </script>
    <script type="text/javascript" src="app.js"></script>
</head>
<body id="wgo-pg-body">
<div id="appLoadingIndicator">
    <div></div>
    <div></div>
    <div></div>
</div>
</body>
</html>
